
<template>
  <div class='container'>
    <el-dialog title="编辑学科" :visible.sync="editShow" :before-close='handleclose' @open='open' width="35%" style="marge-left:45%;">
      <el-form :rules='rules' ref="dataForm" :model="formBase" label-position="left" label-width="80px" style="width: 100%; margin-left:10px;">
        <el-form-item label="学校名称" prop="subjectName">
          <el-input autofocus="autofocus" v-model.lazy="formBase.subjectName"></el-input>
        </el-form-item>
        <!-- switch开关 -->
        <el-switch font-weight='600' inactive-text="是否显示" v-model.lazy="formBase.isFrontDisplay" :active-value='1' :inactive-value='0' active-color="#13ce66" inactive-color="#ff4949">
        </el-switch>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="handleclose">取消</el-button>
        <el-button type="primary" @click="submit">确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { detail, update } from '../../api/hmmm/subjects'
export default {
  name: 'subjectsEdit',
  props: ['editShow', 'reviseId'],
  data () {
    return {
      formBase: {
        // 这个是输入框里的内容
        subjectName: '',
        // 开关默认开启
        isFrontDisplay: ''
      },
      // 表单验证
      rules: {
        subjectName: [
          { required: true, message: '请输入学校名称', trigger: 'blur' }
        ]
      }

    }
  },
  methods: {
    // 关闭弹窗
    handleclose () {
      this.$emit('update:editShow', false)
    },
    // 修改列表
    async submit () {
      const rest = await update({ id: this.reviseId, ...this.formBase })
      this.$emit('update:editShow', false)
      this.$parent.asdList()

      console.log(rest)
    },
    async open () {
      const ret = await detail({ id: this.reviseId })
      this.formBase.subjectName = ret.data.subjectName
      this.formBase.isFrontDisplay = ret.data.isFrontDisplay
    }

  }

}
</script>

<style scoped>
::v-deep .el-dialog {
  margin-right: 210px;
}
.el-form--label-left .el-form-item__label {
  text-align: right;
  font-weight: 600px;
}
.el-form-item--medium {
  margin-bottom: 22px;
}
.el-dialog__footer {
  text-align: center;
}
::v-deep .el-dialog__wrapper {
  margin-right: 300px;
}
.el-switch {
  margin-left: 10px;
}
::v-deep .el-switch__label {
  font-weight: 600;
  margin-right: 14px;
}
</style>
